// https://blog.csdn.net/qq_34182808/article/details/79992465
.kd-radio {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 26px;
    padding: 4px;

    /*lable标签的大小、位置、背景颜色更改，在css选择时，“+”代表相邻元素，即当前元素的下一元素*/
    .kd-radio-square {
        display: block;
        width: 14px;
        height: 14px;
        line-height: 14px;
        cursor: pointer;
        background: white;
        border: 1px #333 solid;
        border-radius: 50%;

        display: flex;
        justify-content: center;
        align-items: center;
    }

    /*当input框为选中状态时，lable标签的样式，其中在css选择时，“：”表示当前input框的值，即checked；
      该部分主要对显示的“对号”的大限居中方式，显示颜色进行了设置*/
    input:checked+.kd-radio-square::before {
        display: block;
        content: " ";
        text-align: center;
        font-size: 12px;
        background-color: #333;
        // transform: scale(.9);
        width: 6px;
        height: 6px;
        border-radius: 50%;
    }

    input[type=radio] {
        visibility: hidden;
        display: none;
    }

    .kd-radio-label {
        display: flex;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        padding-left: 4px;
        height: 24px;
    }

}

.kd-radio-group {
    display: flex;
    flex-direction: row;

    &[direction='horizontal'] {
        flex-direction: row;
        margin-right: 20px;
    }

    &[direction='virtual'] {
        flex-direction: column;
    }
}